<template>
  <div class="feedback-box">
    <div class="feedback-search-box">
      <!-- <div class="search-box-top">
        <div class="title" v-for="item in boxTittle" :key="item.type" :class="{'tittleActive':boxTittleType == item.type}" @click="clickTittle(item)">
          <span>{{item.label}}</span>
          <span class="bottom_border"></span>
        </div>
      </div> -->
      <div class="search-box">
        <div class="search-item">
          <span>反馈时间段</span>
          <el-date-picker
            v-model="form.begintime"
            type="date"
            placeholder="请选择"
            value-format="yyyy-MM-dd"
            style="width:140px"
          ></el-date-picker>
          <span class="separator">~</span>
          <el-date-picker
            v-model="form.endtime"
            type="date"
            placeholder="请选择"
            value-format="yyyy-MM-dd"
            style="width:140px"
          ></el-date-picker>
        </div>
        <div class="search-item">
          <span>用户名称</span>
          <el-input
            class="name"
            style="width:160px"
            v-model="form.username"
            placeholder=" 请输入用户名称"
            clearable
          ></el-input>
        </div>
        <div class="search-item">
          <span>所在地区</span>
          <city-Cascader
            style="width:180px"
            :citys="form.citys"
            :level="level"
            @handleChange="handleCityChange"
          ></city-Cascader>
        </div>
        <div class="search-item">
          <el-button
            class="search"
            type="primary"
            @click="toQuery"
          >查询</el-button>
        </div>
      </div>
      <!-- tab -->
      <div class="main">
        <ul class="cash-title-list">
		  <template v-for="item in tabs">
			<!-- 消息的气泡 -->
			<el-badge :value="unread" :max="99" :hidden="item.label != '待回复' || unread == 0" class="item">
				<li
					class="item-title"
					:key="item.type"
					v-html="`${item.label}`"
					:class="{'active':current === item.type}"
					@click="clickTab(item)"
				></li>
			</el-badge>
		  </template>
        </ul>
      </div>
      <div
        class="nodata"
        v-if="list.length == 0"
      >
        <span>暂时没有相关内容</span>
      </div>

      <div
        class="content"
        v-for="(item,index) in list "
        :key="index"
        v-loading="loading"
        element-loading-text="加载中"
      >
        <div class="content-t pr">
          <span class="user">{{item.username}}</span>
          <span
            class="telnum pa"
            v-if="boxTittleType != '2'"
          >{{item.telnum}}</span>
          <span class="data pa">{{item.createtime}}</span>
        </div>

        <div class="content-b pr">
          <span class="content-text">反馈内容: {{ item.content }}</span>
        </div>
        <!-- <div class = "content-createtime">
                    <span class="data">{{item.createtime}}</span>
                    <span class = "content-button">
                        <span @click = "toReply()">回复</span>
                        <span @click = "toIgnore()">忽略</span>
                    </span>
        </div>-->
        <!-- <div class="content-right-button pr" :class="{'currentButtom':current != 1}"> -->
        <!-- <span class="content-right" @click="toReply()" v-if="current == 1">回复</span>
        <span class="content-right" @click="toIgnore()" v-if="current == 1">忽略</span>-->
        <!-- <span class="content-right" @click="feedback(item.opinionid)">详情</span>
        </div>-->
        <div class="content-right-button pr currentButtom">
          <span
            class="content-right"
            @click="feedback(item.opinionid)"
          >详情</span>
        </div>
        <!-- <div class="data-time ">
                    <span class="data pa">{{item.createtime}}</span>

        </div>-->
      </div>
      <div class="feedback-b">
        <!-- 分页 -->
        <!-- <el-pagination :total="total" @current-change="handleCurrentChange" background layout="total, prev, pager, next, jumper">
        </el-pagination>-->
        <el-pagination
          @size-change="handleSizeChange"
          @current-change="handleCurrentChange"
          :current-page="currentPage"
          :page-sizes="[10,20, 30, 50,100]"
          :page-size="form.pagesize"
          layout="total, sizes, prev, pager, next, jumper"
          :total="total"
          background
        ></el-pagination>
      </div>
    </div>
  </div>
</template>


<script src="./feedback.js">
</script>

<style scoped src="./feedback.css">
</style>

